<template>
  <NuxtLayout name="content">
    <!-- <article v-if="pageData?.contentHtml" v-html="pageData?.contentHtml" /> -->
    <client-only>
      <MarkdownOnlyRead v-if="pageData?.content" :text="pageData?.content" :navigation="false" :readmodel="false"
        :toolbarsFlag="false" />
    </client-only>
    <n-space class="comment" v-if="pageData?.isCommentOpen" vertical>
      <Comments @createAfter="createAfter" />
      <CommentsShow ref="commentsShow" />
    </n-space>
  </NuxtLayout>
</template>

<script setup lang="ts">
import { NSpace, NButton, NIcon } from "naive-ui";
import { type page, findViewsByPath } from "~/api/page";
const pageData = ref<page>();
const commentsShow = ref();
const createAfter = () => {
  commentsShow.value.getComment();
};
const route = useRoute();
const findPageByPath = async () => {
  const list = route.path.split("/");
  const res = await findViewsByPath(list[list.length - 1]);
  if (res?.data) {
    pageData.value = res.data;
    useHead({
      title: pageData.value?.name ?? "扩展页面", //网站标题
    });
  }
};

findPageByPath();
</script>
<style scoped>
.comment {
  margin-top: 20px;
}
</style>
